<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="http://www.thymeleaf.org/">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}"/>
    <link th:href="@{/erp/Widget/icheck/icheck.css}" rel="stylesheet" type="text/css"/>
    <!--[if IE 7]>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome-ie7.min.css}"/>
    <![endif]-->
    <!--[if lte IE 8]>
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace-ie.min.css}"/>
    <![endif]-->
    <script th:src="@{/erp/assets/js/jquery.min.js}"></script>
    <script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
    <script type="text/javascript" th:src="@{/erp/js/H-ui.js}"></script>
    <script type="text/javascript" th:src="@{/erp/js/H-ui.admin.js}"></script>
    <script th:src="@{/erp/assets/js/typeahead-bs2.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.dataTables.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.dataTables.bootstrap.js}"></script>
    <script th:src="@{/erp/assets/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/erp/assets/laydate/laydate.js}" type="text/javascript"></script>
    <title>产品生产过程查询</title>
</head>
<body>
    <div id="brand_style">
        <form id="shu">
        <div class="search_style">
            <ul class="search_content clearfix">
                <li><label class="l_f">订单编号</label>
                    <input name="orderId" type="text" id="orderId" placeholder="输入订单编号" style="width:150px"/></li>
                <li style="width:90px;">
                    <button type="button" class="cha_x btn_search" id="shaYa">查询</button>
                </li>
            </ul>
        </div>
        </form>
    </div>

    <div id="hide_tab" class="table_menu_list" style="display:none;">
        <table class="table table-striped table-bordered table-hover" id="sample-table">
            <thead>
            <tr>
                <th width="100px">id</th>
                <th width="100px">产品名称</th>
                <th width="100">订单编号</th>
                <th width="120px">产品型号</th>
                <th width="100px">生产数量</th>
                <th width="180px">下单时间</th>
                <th width="80px">状态</th>
                <th width="80px">操作</th>
            </tr>
            </thead>
        </table>
    </div>


    <script type="text/javascript">
        jQuery(function($) {
        var table1;

            $(".cha_k").on('click', function () {
                $(".cha_k_hide").show();
            });
            $("#shaYa").on('click', function () {
                $("#hide_tab").show();
                 table1 = $('#sample-table').DataTable( {
                    destroy:true,
                    ordering: false,
                    serverSide: true,     // true表示使用后台分页
                    ajax: {
                        "url": "/quality/goAway",  // 异步传输的后端接口url
                        "type": "POST",
                        dataSrc: "data",
                        data: function (d) {
                            var param = {};
                            param.draw = d.draw;
                            param.start = d.start;
                            param.length = d.length;
                            param.orderId = $('#orderId').val()
                            return param;//自定义需要传递的参数。
                        },
                    },
                    'autoWidth': false,
                    "bStateSave": false,//状态保存

                    "columns": [
                        {"data": "id"},
                        {"data": "productName"},
                        {"data": "orderId"},
                        {"data": "productModel"},
                        {"data": "sum"},
                        {"data": "orderTime"},
                        {"data": "orderStatus"},
                        {"data": "orderId",
                            "createdCell": function (td, cellData, rowData, row, col) {
                                $(td).empty().append('<a value="' + row + '" style="text-decoration:none" class="que_r btn btn-xs btn-success" href="javascript:;" title="详情"><i class=" icon-list bigger-120"></i></a>');
                            }
                        }
                    ]
                } );
            });

            $('table').on('click','.btn-success', function () {
                debugger
                var index = $(this).attr('value');
                var datas = table1.row(index).data();
                layer.open({
                    type: 2,
                    title: '详情',
                    shadeClose: true, //点击遮罩关闭层
                    area: ['900px', '600px'],
                    content: '/quality/log?data='+datas.orderId
                });
            });
        })
    </script>

</body>
</html>


